import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:smart_devices/components/home/device.dart';
import 'package:smart_devices/components/home/index.dart';
import 'package:smart_devices/components/home/mine.dart';
import 'package:smart_devices/components/home/spare.dart';
import 'package:smart_devices/routes/index.dart';
import 'package:smart_devices/utils/colors.dart';
import 'package:smart_devices/utils/styles.dart';
import 'package:smart_devices/utils/tools.dart';

import 'home_logic.dart';

class HomeView extends GetView<HomeLogic> {
  const HomeView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return GetBuilder<HomeLogic>(builder: (_) {
      return Scaffold(
        body: createPageView(),
        resizeToAvoidBottomInset: true,
        bottomNavigationBar: Obx(() => Container(
              height: 70,
              padding: const EdgeInsets.only(bottom: 15),
              decoration: const BoxDecoration(
                  color: Colors.white,
                  border: Border(top: BorderSide(color: Color.fromRGBO(228, 228, 228, 1)))),
              clipBehavior: Clip.none,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Expanded(
                    child: InkWell(
                      onTap: () {
                        controller.index.value = 0;
                        gotoView();
                      },
                      child: Column(
                        children: [
                          Container(
                            padding: const EdgeInsets.only(top: 5),
                            alignment: Alignment.center,
                            child: ToolsUtils.assetImageSvg(
                                controller.index.value == 0 ? 'u1740_selected.svg' : 'u1740.svg',
                                width: 20,
                                height: 20),
                          ),
                          Expanded(
                              child: Center(
                            child: Text(
                              '首页',
                              style: StylesUtils.customTextStyle(
                                  color: controller.index.value == 0
                                      ? ColorsUtils.color0052
                                      : ColorsUtils.colorCccc,
                                  fontSize: 15),
                            ),
                          ))
                        ],
                      ),
                    ),
                  ),
                  Expanded(
                    child: InkWell(
                      onTap: () {
                        controller.index.value = 1;
                        gotoView();
                      },
                      child: Column(
                        children: [
                          Container(
                            padding: const EdgeInsets.only(top: 5),
                            alignment: Alignment.center,
                            child: ToolsUtils.assetImageSvg(
                                controller.index.value == 1 ? 'u1736_selected.svg' : 'u1736.svg',
                                width: 20,
                                height: 20),
                          ),
                          Expanded(
                              child: Center(
                            child: Text(
                              '设备',
                              style: StylesUtils.customTextStyle(
                                  color: controller.index.value == 1
                                      ? ColorsUtils.color0052
                                      : ColorsUtils.colorCccc,
                                  fontSize: 15),
                            ),
                          ))
                        ],
                      ),
                    ),
                  ),
                  Expanded(
                    child: Container(
                        alignment: Alignment.topCenter,
                        child: Transform.translate(
                          offset: const Offset(0, -10),
                          child: InkWell(
                            onTap: () {
                              Get.toNamed(Routes.scan);
                            },
                            child: CircleAvatar(
                              backgroundColor:
                                  ColorsUtils.parseColorFromHexString(ColorsUtils.color0052),
                              radius: 30,
                              child: ToolsUtils.assetImageSvg('u1731.svg'),
                            ),
                          ),
                        )),
                  ),
                  Expanded(
                    child: InkWell(
                      onTap: () {
                        controller.index.value = 2;
                        gotoView();
                      },
                      child: Column(
                        children: [
                          Container(
                            padding: const EdgeInsets.only(top: 5),
                            alignment: Alignment.center,
                            child: ToolsUtils.assetImageSvg(
                                controller.index.value == 2 ? 'u1725_selected.svg' : 'u1725.svg',
                                width: 20,
                                height: 20),
                          ),
                          Expanded(
                              child: Center(
                            child: Text(
                              '备件',
                              style: StylesUtils.customTextStyle(
                                  color: controller.index.value == 2
                                      ? ColorsUtils.color0052
                                      : ColorsUtils.colorCccc,
                                  fontSize: 15),
                            ),
                          ))
                        ],
                      ),
                    ),
                  ),
                  Expanded(
                    child: InkWell(
                      onTap: () {
                        controller.index.value = 3;
                        gotoView();
                      },
                      child: Column(
                        children: [
                          Container(
                            padding: const EdgeInsets.only(top: 5),
                            alignment: Alignment.center,
                            child: ToolsUtils.assetImageSvg(
                                controller.index.value == 3 ? 'u1729_selected.svg' : 'u1729.svg',
                                width: 20,
                                height: 20),
                          ),
                          Expanded(
                              child: Center(
                            child: Text(
                              '我的',
                              style: StylesUtils.customTextStyle(
                                  color: controller.index.value == 3
                                      ? ColorsUtils.color0052
                                      : ColorsUtils.colorCccc,
                                  fontSize: 15),
                            ),
                          ))
                        ],
                      ),
                    ),
                  ),
                ],
              ),
            )),
      );
    });
  }

  PageView createPageView() {
    return PageView(
      physics: const NeverScrollableScrollPhysics(),
      scrollBehavior: const ScrollBehavior(),
      controller: controller.pageController,
      children: const [IndexPage(), DevicePage(), SparePage(), MinePage()],
    );
  }

  void gotoView() {
    controller.pageController.animateToPage(controller.index.value,
        duration: const Duration(milliseconds: 500), curve: Curves.linear);
  }
}
